<template>
  <view class="message-detail">
    <!-- 消息内容 -->
    <view class="message-content">
      <view class="message-title">{{messageInfo.title||'-' }}</view>
      <view class="message-time">{{messageInfo.createTime||'-'}}</view>
      <view class="message-text">{{messageInfo.content||'-'}}</view>
    </view>
  </view>
</template>

<script setup>
  import { ref } from 'vue'
  import { onLoad } from '@dcloudio/uni-app'

  const messageInfo = ref({
    title: '',
    time: '',
    content: ''
  })

  // 返回上一页
  const goBack = () => {
    uni.navigateBack()
  }

  onLoad((option) => {
    if (option.item) {
      messageInfo.value = JSON.parse(option.item)
    }
  })
</script>

<style lang="scss" scoped>
  .message-detail {
    min-height: 95vh;
    background: #F3F3F3;
    overflow: hidden;

    .message-content {
      background: #FFFFFF;
      padding: 40rpx 30rpx;
      margin: 30rpx;
      min-height: 85vh;
      border-radius: 26rpx;

      .message-title {
        font-size: 34rpx;
        color: #111827;
        font-weight: 500;
        margin-bottom: 20rpx;
      }

      .message-time {
        font-size: 24rpx;
        color: #9F9F9F;
        margin-bottom: 20rpx;
      }

      .message-text {
        font-size: 28rpx;
        color: #666666;
        line-height: 1.6;
        padding-top: 16rpx;
        border-top: 1rpx solid #F3F3F3;
      }
    }
  }
</style>